﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0046)http://www.vovisoft.com/dotNET/Bai15/Bai15.htm -->
<HTML><HEAD><TITLE>.NET Lesson 15</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<META http-equiv=Content-Language content=vi>
<META content="MSHTML 6.00.2716.2200" name=GENERATOR>
<META content=FrontPage.Editor.Document name=ProgId>
<META 
content="Visual Basic, VB Programming in Vietnamese, Vovisoft, VB6, VB Tutorials, Learn Visual Basic, Internet, Unicode, Vietnamese VB tutorials, Database, Asp, Java, Javascript, VBscript, FrontPage 2000, XML, Ms Office 2000" 
name=keywords></HEAD>
<BODY leftMargin=0 topMargin=0 marginheight="0" marginwidth="0">
<CENTER><A href="http://www.vovisoft.com/"><IMG height=77 alt="Logo of Vovisoft" 
src="Bai 15_files/vs-logo4_10.gif" width=102 border=0> </A><FONT face=Tahoma>
<H2><FONT face=Tahoma color=#800000>Bài 15</FONT></H2>
<H2><FONT face=Tahoma color=#800000>DataGrid (phần III)</FONT></H2></CENTER>
<BLOCKQUOTE>
  <BLOCKQUOTE>
    <H3><FONT color=green>Edit XML file dựa trên XML Schema</FONT></H3>Sau khi 
    xác định cấu trúc và datatypes của các Elements và Attributes của table 
    <B>operator</B>, bây giờ ta sẽ cho data vào table ấy. Bạn hãy dùng IDE 
    menuCommand <B>Project | Add New Item</B> để thêm một <B>XML file</B> (click 
    lên icon <B>XML file</B>) vào project. Sửa Name của file ấy từ 
    <B>XMLFile1</B> thành <B>alarmlist.xml</B>.<BR><BR>Right click lên trang 
    trống của XML, chỉ mới có câu:<BR>
    <BLOCKQUOTE><FONT color=blue>&lt;?</FONT>xml <FONT 
      color=red>version</FONT><FONT color=blue>="1.0"</FONT> <FONT 
      color=red>encoding</FONT><FONT color=blue>="utf-8" 
    ?&gt;</FONT></BLOCKQUOTE>Chọn PopupMenu command <B>Properties</B> để hiển 
    thị dialog <B>DOCUMENT Property Pages</B>. 
    <BLOCKQUOTE><IMG height=428 src="Bai 15_files/documentproperty.gif" 
      width=723></BLOCKQUOTE>Trong cái Dropdown Combo, chọn 
    <B>http://tempuri.org/operatorlist.xsd</B> làm <B>Target Schema</B> cho 
    operatorlist.xml của chúng ta. Sau đó bạn sẽ thấy Element operatorlist có 
    thêm một Attribute mới tên <B>xmlns</B> (chữ <B>ns</B> trong xmlns là viết 
    tắc cho <B>namespace</B>) với trị số http://tempuri.org/operatorlist.xsd. 
    Điều nầy có nghĩa là ta áp đặt Schema operatorlist.xsd lên cấu trúc và các 
    dữ kiện bên trong XML file operatorlist.xml.<BR><BR>Bây giờ, bạn có thể bắt 
    đầu đánh data vào trang operatorlist.xml. Để ý là vì IDE biết ta đang dùng 
    Schema operatorlist.xsd, nên nó có thể áp dụng <B>Intellisense</B> để giúp 
    ta edit chính xác và nhanh như trong hình dưới đây: 
    <BLOCKQUOTE><IMG height=191 src="Bai 15_files/editXML.gif" 
    width=540></BLOCKQUOTE>Mỗi khi bạn đánh xong <B>opening Tag</B> operator là 
    <B>closing Tag</B> của nó tự động hiện ra. Bên trong opening Tag của 
    operator, Intellisense sẽ hiển thị tên các Attributes để bạn chọn. Mỗi khi 
    bạn đánh dấu <B>=</B> sau tên một Attribute thì IDE sẽ tự động insert một 
    cặp dấu ngoặc kép.<BR><BR>Sau khi đánh xong dữ kiện của một số operators, 
    nếu bạn click MenuCommand <B>XML | Validate XML Data</B> để IDE validate các 
    dữ kiện ta vừa mới cho vào để xem nó có đúng như định nghĩa trong cái Schema 
    operatorlist.xsd không thì sẽ thấy IDE than phiền như sau:<BR><BR><FONT 
    size=-1><B>E:\NET\HongDevelopment\LessonPreparation\Operators\operatorlist.xml(4): 
    Element 'http://tempuri.org/operatorlist.xsd:operatorlist' has invalid child 
    element 'http://tempuri.org/operatorlist.xsd:operator'. 
    </B></FONT><BR><BR>Đó là vì trong Schema không có nói rõ là bên trong 
    Element <B>operatorlist</B> có nhiều Element <B>operator</B>. Để giải quyết 
    trở ngại nầy ta phải edit trực tiếp trong mã nguồn XML của Schema. Bạn hãy 
    doubleclick lên file name operatorlist.xsd của Solution Explorer và nếu cần 
    thì click Tab <B>XML</B> của trang Schema để hiển thị mã nguồn XML của 
    operatorlist.xsd.<BR><BR>Thay thế cái cặp Tags 
    <B>&lt;xs:sequence&gt;&lt;/xs:sequence&gt;</B> bằng cặp Tags 
    <B>&lt;xs:choice maxOccurs="unbounded"&gt;&lt;/xs:choice&gt;</B> như trong 
    hình dưới đây để nói rằng có <B>nhiều</B> Elements <B>operator</B> trong 
    Element <B>operatorlist</B> : 
    <BLOCKQUOTE><IMG height=423 src="Bai 15_files/modifiedSchema.gif" 
      width=774></BLOCKQUOTE>
    <H3><FONT color=green>Typed Dataset</FONT></H3>Trong bài 13 ta đã tạo 
    Dataset từ Schema bằng cách dùng IDE MenuCommand <B>XML | Schema Generate 
    Dataset</B>. Sau đó mỗi khi muốn nói đến một datafield của record ta dùng 
    tên của datafield ấy. Thí dụ để nói đến datafield <B>description</B> trong 
    DataRowView <B>drv</B> ta viết như sau: <BR><PRE>    Label1.Text = drv("description")
</PRE>Một cách viết dễ đọc và tự nhiên hơn là:<BR><BR><PRE>    Label1.Text = drv.description
</PRE>Coding cách nầy được thêm lợi điểm là ngay trước khi chạy chương 
    trình, compiler sẽ cho biết ngay nếu ta đánh vần không đúng chữ 
    <B>description</B> chẳng hạn. Thêm nữa, Intellisense có thể hổ trợ ta trong 
    lúc đánh code vào bằng cách hiển thị danh sách của tất cả datafields của 
    drv. So với trường hợp ta dùng tên datafield, nếu đánh vần không đúng chữ 
    <B>description</B> thì cho đến run-time chương trình mới khám phá ra việc 
    ấy.<BR><BR>Loại Dataset cho phép ta code <B>drv.description</B> được gọi là 
    <B>Typed Dataset</B> và ta có thể phát sinh (generate) nó từ Schema của XML 
    file bằng cách dùng line command:<BR><PRE>   xsd.exe /d  /l:VB operatorlist.xsd  /n:operatorlistDS
</PRE>Ở đây ta dùng chương trình dụng cụ <B>xsd.exe</B> để phát sinh từ 
    Schema <B>operatorlist.xsd</B> một <FONT color=blue><B>d</B></FONT>ataset 
    trong ngôn ngữ (<FONT color=blue><B>l</B></FONT>anguage) lập trình VB với 
    <FONT color=blue><B>n</B></FONT>amespace tên 
    <B>operatorlistDS</B>.<BR><BR>Nếu bạn không thấy <B>xsd.exe</B> thì tìm nó 
    trong folder <B>\Program Files\Microsoft Visual Studio 
    .NET\FrameworkSDK\Bin</B> rồi có thể copy nó vào project folder. Lưu ý là 
    bản xsd.exe dùng trong final version của VS.NET thì khác với bản xsd.exe 
    dùng trong version Beta 2.<BR><BR>Kế đó, bạn có thể thêm Typed Dataset nầy 
    vào project bằng cách dùng IDE MenuCommand <B>Project | Add Existing 
    Item</B> rồi chọn <B>operatorlist.vb</B> từ project folder.<BR>
    <H3><FONT color=green>Dùng Dataform wizard để phát sinh form từ 
    Dataset</FONT></H3>Ta sẽ dùng Dataform Wizard để generate một dataform. 
    Nhưng trước đó, ta cần phải compile project với IDE menuCommand <B>Build | 
    Build Operators</B> để chốc nữa Wizard thấy được Typed Dataset.<BR><BR>Bạn 
    hãy dùng IDE MenuCommand <B>Project | Add Windows Form</B>, click lên icon 
    <B>Data Form Wizard</B> và đổi Name của form thành <B>frmOperator.vb</B> như 
    trong hình dưới đây: 
    <BLOCKQUOTE><IMG height=423 src="Bai 15_files/frmOperator.gif" 
    width=738></BLOCKQUOTE>Tiếp theo đó bạn sẽ thấy Data Form Wizard dialog với 
    tên của Typed Dataset hiện ra trong ComboBox của <B>Option Use the following 
    dataset:</B> như dưới đây: 
    <BLOCKQUOTE><IMG height=451 src="Bai 15_files/dataform.gif" 
    width=500></BLOCKQUOTE>Để y nguyên và click <B>Next</B>: 
    <BLOCKQUOTE><IMG height=451 src="Bai 15_files/includeupdate.gif" 
    width=500></BLOCKQUOTE>Click Checkbox <B>Include an Update button</B>, rồi 
    click <B>Next</B>: 
    <BLOCKQUOTE><IMG height=451 src="Bai 15_files/master.gif" 
    width=500></BLOCKQUOTE>Để y nguyên và click <B>Next</B>: 
    <BLOCKQUOTE><IMG height=451 src="Bai 15_files/singlerecord.gif" 
    width=500></BLOCKQUOTE>Chọn các options như trong hình bên trên rồi click 
    <B>Finish</B>.<BR><BR>Form <B>frmOperator</B> sẽ được generated và tự động 
    cho vào Project. Bây giờ bạn hãy right click lên tên file <B>Form1.vb</B> 
    trong Solution Explorer để delete nó và right click tên project 
    <B>Operators</B> rồi chọn command <B>Properties</B> từ PopupMenu để đổi 
    <B>Startup object</B> thành <B>frmOperator</B>. Kế đó hãy sắp xếp các object 
    trên form frmOperator cho gọn lại như trong hình dưới đây: 
    <BLOCKQUOTE><IMG height=360 src="Bai 15_files/basicForm.gif" 
    width=286></BLOCKQUOTE>Để hiển thị các operator records như một Spreadsheet 
    phía dưới, bạn hãy thêm một DataGrid tên <B>DataGrid1</B> vào form. Và để 
    dấu các chữ của Password trong Dataform, ta sẽ Edit <B>Property 
    PasswordChar</B> của TextBox <B>editpassword</B> thành <B>*</B> như dưới 
    đây: 
    <BLOCKQUOTE><IMG height=357 src="Bai 15_files/HidePassword.gif" 
    width=550></BLOCKQUOTE>Để load data vào DataForm sau khi khởi động chương 
    trình bạn hãy doubleclick lên button Load rồi viết code sau đây cho Event 
    Click: <BR><BR>
    <TABLE bgColor=#f6f6f6>
      <TBODY>
      <TR>
        <TD><FONT size=3><PRE><FONT color=blue>Private</FONT> <FONT color=blue>Sub</FONT> btnLoad_Click(<FONT color=blue>ByVal</FONT> sender <FONT color=blue>As</FONT> System.Object, <FONT color=blue>ByVal</FONT> e <FONT color=blue>As</FONT> System.EventArgs) <FONT color=blue>Handles</FONT> btnLoad.Click 
   <FONT color=green>' Read operator data from XML file</FONT>
   Me.objoperatorlist.ReadXml("..\operatorlist.xml") 
   <FONT color=green>' Bind DataGrid1's Datasource to table operator</FONT>
   DataGrid1.SetDataBinding(Me.objoperatorlist, "operator") 
   <FONT color=green>' Define our owned display style. Do not display Passwords</FONT>
   AddCustomDataTableStyle() 
   <FONT color=green>' Display current record position</FONT>
   Me.objoperatorlist_PositionChanged() 
<FONT color=blue>End</FONT> <FONT color=blue>Sub</FONT> 
</PRE></FONT></TD></TR></TBODY></TABLE>Ta sẽ gọi một <B>Sub 
    AddCustomDataTableStyle</B> để hiển thị các records của operators trong 
    DataGrid1. <B>RowHeaders</B> của DataGrid1 sẽ được để yên <B>visible</B> để 
    cho user có thể click bên trái một record khi muốn làm việc với record ấy. 
    Đồng thời ta cũng cố ý không hiển thị Datafield 
    <B>password</B>.<BR><BR>Coding của Sub AddCustomDataTableStyle được liệt kê 
    dưới đây: 
    <BLOCKQUOTE>
      <TABLE bgColor=#f6f6f6>
        <TBODY>
        <TR>
          <TD><FONT size=3><PRE><FONT color=blue>Private</FONT> <FONT color=blue>Sub</FONT> AddCustomDataTableStyle() 
   <FONT color=green>' Instantiate a DataGridTableStyle object</FONT>
   <FONT color=blue>Dim</FONT> ts1 <FONT color=blue>As</FONT> <FONT color=blue>New</FONT> DataGridTableStyle() 
   <FONT color=green>' Map table operator to it</FONT>
   ts1.MappingName = "operator" 
   <FONT color=green>' Set other properties.</FONT>
   ts1.AlternatingBackColor = Color.Beige 
   <FONT color=green>' Add a first column style.</FONT>
   <FONT color=blue>Dim</FONT> TextCol1 <FONT color=blue>As</FONT> <FONT color=blue>New</FONT> DataGridTextBoxColumn() 
   TextCol1.MappingName = "operatorid" 
   TextCol1.HeaderText = "OperId" 
   TextCol1.Width = 50 
   ts1.GridColumnStyles.Add(TextCol1) 
   DataGrid1.TableStyles.Add(ts1) 
   <FONT color=green>' Add a second column style.</FONT>
   <FONT color=blue>Dim</FONT> TextCol2 <FONT color=blue>As</FONT> <FONT color=blue>New</FONT> DataGridTextBoxColumn() 
   TextCol2.MappingName = "username" 
   TextCol2.HeaderText = "Operator" 
   TextCol2.Width = 120 
   ts1.GridColumnStyles.Add(TextCol2) 
   <FONT color=green>' Add a third column style.</FONT>
   <FONT color=blue>Dim</FONT> TextCol3 <FONT color=blue>As</FONT> <FONT color=blue>New</FONT> DataGridTextBoxColumn() 
   TextCol3.MappingName = "level" 
   TextCol3.HeaderText = "Level" 
   TextCol3.Width = 35 
   ts1.GridColumnStyles.Add(TextCol3) 
   <FONT color=green>' Now add ts1 to the Datagrid1's collection of TableStyles</FONT>
   DataGrid1.TableStyles.Add(ts1) 
<FONT color=blue>End</FONT> <FONT color=blue>Sub</FONT> 
</PRE></FONT></TD></TR></TBODY></TABLE></BLOCKQUOTE>Bây giờ hãy chạy chương 
    trình và click nút Load. Data của các operators sẽ được loaded vào cả 
    DataForm lẫn DataGrid1. Khi bạn click các nút <B>navigators</B> để di chuyển 
    đến record sau hay record trước, cái hình tam giác nho nhỏ trong DataGrid 
    RowHeaders nằm bên trái DataGrid1 cũng di chuyển theo như trong hình dưới 
    đây: 
    <BLOCKQUOTE><IMG height=472 src="Bai 15_files/FormandGrid.gif" 
    width=272></BLOCKQUOTE>Ngược lại, khi bạn click bên trái một row trong 
    DataGrid1, DataForm sẽ hiển thị chi tiết các dữ kiện của record ấy. Tuy 
    nhiên hàng chữ cho biết vị trí của record (nằm giữa các nút navigators) vẫn 
    không được thay đổi theo.<BR><BR>Để giải quyết chuyện đó ta tạm dùng Event 
    TextChanged của TextBox <B>editoperatorid</B> như sau:<BR><BR>
    <TABLE bgColor=#f6f6f6>
      <TBODY>
      <TR>
        <TD><FONT size=3><PRE><FONT color=blue>Private</FONT> <FONT color=blue>Sub</FONT> editoperatorid_TextChanged(<FONT color=blue>ByVal</FONT> sender <FONT color=blue>As</FONT> System.Object, <FONT color=blue>ByVal</FONT> e <FONT color=blue>As</FONT> System.EventArgs) <FONT color=blue>Handles</FONT> editoperatorid.TextChanged 
   <FONT color=green>' Show position of current record</FONT>
   objoperatorlist_PositionChanged() 
<FONT color=blue>End</FONT> <FONT color=blue>Sub</FONT> 
</PRE></FONT></TD></TR></TBODY></TABLE>Để cho đầy đủ, ta cũng sẽ viết code 
    cho Event Click của button <B>Update</B> để lưu trử data trong một XML file 
    tên <B>operatorlistNew.xml</B>:<BR><BR>
    <TABLE bgColor=#f6f6f6>
      <TBODY>
      <TR>
        <TD><FONT size=3><PRE><FONT color=blue>Private</FONT> <FONT color=blue>Sub</FONT> btnUpdate_Click(<FONT color=blue>ByVal</FONT> sender <FONT color=blue>As</FONT> System.Object, <FONT color=blue>ByVal</FONT> e <FONT color=blue>As</FONT> System.EventArgs) <FONT color=blue>Handles</FONT> btnUpdate.Click 
   <FONT color=green>' Accept all changes in Dataset</FONT>
   Me.objoperatorlist.AcceptChanges() 
   <FONT color=green>' Write Dataset to XML file</FONT>
   Me.objoperatorlist.WriteXml("..\operatorlistNew.xml") 
<FONT color=blue>End</FONT> <FONT color=blue>Sub</FONT> 
</PRE></FONT></TD></TR></TBODY></TABLE><BR><BR>Bạn có thể <A 
    href="http://www.vovisoft.com/dotNET/Bai15/Operators.zip">tải về chương 
    trình Operators nầy</A> tại đây. 
    <BLOCKQUOTE><A href="http://www.vovisoft.com/"><IMG height=40 
      src="Bai 15_files/homejump.gif" width=40><A>&nbsp;&nbsp;<A 
      href="http://www.vovisoft.com/dotNET/default.asp">Học Microsoft 
      .NET</A><BR><BR></BLOCKQUOTE></FONT><!-- Start of bottom bar for copyright notice etc -->
    <TABLE class=clsNavLinks id=tblFooterLinks cellSpacing=0 cellPadding=0 
    width="100%" border=0>
      <TBODY>
      <TR>
        <TD class=clsRaised width=785 bgColor=#6699cc colSpan=5>
          <P align=center><FONT face=Tahoma color=#ffffff size=1>Vovisoft © 
          2000. All rights reserved.</FONT></P></TD></TR>
      <TR>
        <TD width=256>
          <P align=center><FONT face=Tahoma size=1>&nbsp;&nbsp; Last Updated: <!--webbot 
      bot="Timestamp" S-Type="REGENERATED" S-Format="%d %b %Y" startspan -->12 
          Apr 2002<!--webbot 
      bot="Timestamp" endspan i-checksum="15029" --> </FONT></P></TD>
        <TD width=181><FONT face=Tahoma size=1>&nbsp;</FONT></TD>
        <TD width=258>
          <P align=center><FONT face=Tahoma size=1><A 
          href="mailto:dixon@vovisoft.com">Webmaster</A></FONT></P></TD></TR></TBODY></TABLE><BR></BLOCKQUOTE></BLOCKQUOTE></BODY></HTML>
